

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>添加修改</title>
    {include file="include/top"}
    <style>
        .layui-form-item .layui-input-inline{width: 80%;}
        #LAY_layedit_2{background: #fff;}
        .gunList{display: flex;}
        .gunList div{position: absolute;top: -10px;right: -10px;border: 1px solid #666;width: 20px;height: 20px;z-index: 99;background-color: #fff;border-radius: 20px;text-align: center;line-height: 20px;cursor: pointer;}
        .gunList span{border: 1px solid #666;padding: 0px 20px;line-height: 32px;height: 32px;margin-right: 20px;position: relative;z-index: 98;}
    </style>
</head>
<body>

<div class="layui-form" lay-filter="layuiadmin-form-useradmin" id="layuiadmin-app-form-tags" style="padding: 20px 0 0 0;">
    <?php foreach($oil as $v){?>
    <div class="layui-form-item" style="background-color: #fff;padding: 4px 0;">
        <label class="layui-form-label">{$v.oil_no}</label>
        <div class="layui-input-inline gunList">
            {if is_array($v['gun_nos']) && count($v['gun_nos'])>0}
            <?php foreach($v['gun_nos'] as $v2){?>
            <span>
                <font>{$v2.gun_no}</font><div>X</div>
            </span>
            <?php }?>
            {/if}
            <i class="layui-icon layui-icon-add-circle" style="font-size: 32px;cursor: pointer"></i>
        </div>
    </div>
    <?php }?>
</div>

{include file="include/js"}
<script>
    layui.config({
        base: '/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index','form','layedit','upload'],function () {
        var $=layui.$;
        var form=layui.form;
        var upload = layui.upload
        var layedit = layui.layedit;
        var insertHtml = "<span><font>{gun}</font><div>X</div></span>";
        $(document).on("click",".gunList span div",function (){
            $(this).parent().remove()
        })
        $(document).on("click",".layui-icon",function (){
            var obj=$(this)
            layer.prompt("请输入枪号：",function (re){
                layer.closeAll()
                obj.before(insertHtml.replace("{gun}",re))
            })
        })
    });
</script>
</body>
</html>